<template>
  <div class="header">
     <div class="logo">{{logo}}</div>
     <div class="title">{{navstyle}}</div>
     <div class="icon">
       <img v-show="saomiao" src="./images/saomiao.png" alt="">
       <img v-show="shouhuo" src="./images/shouhuo.png" alt="">
       <img v-show="faxian" src="./images/faxian.png" alt="">
     </div>
  </div>
</template>
<style lang="scss">
 .header{
   width: 100%;
   height: 50px;
   background: tomato;
   text-align: center;
    .logo{
      width: 20%;
      height: 50px;
      background: #000000;
      float: left;
      line-height: 50px;
      color: #fff;
    }
   .title{
     width: 60%;
     height: 50px;
     background: paleturquoise;
     float: left;
     line-height: 50px;
     font-size: 15px;
   }
   .icon{
     width: 20%;
     height: 50px;
     float: left;
     background: olive;
     img{
       width: 30px;
       height: 30px;
       margin-top: 10px;
     }
   }
 }
</style>
<script>
  export default {
    data() {
      return {
//        saomiao:false,
//        faxian:false,
//        shouhuo:false
      }
    },
    props:['logo','navstyle','saomiao','faxian','shouhuo']
  }
</script>
